import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { Icon } from '/@/components/Icon';
import { render } from '/@/utils/common/renderUtils';
import { duplicateCheck } from '/@/views/system/user/user.api';
import { JVxeTypes, JVxeColumn } from '/@/components/jeecg/JVxeTable/types';
import { bindMapFormSchema } from '/@/utils/common/compUtils';
import { getDataSourceList } from './cgreport.api';

export const columns = [
  {
    title: '报表名字',
    align: 'center',
    dataIndex: 'name',
    width: 120,
  },
  {
    title: '报表编码',
    align: 'center',
    dataIndex: 'code',
    width: 120,
  },
  {
    title: '报表SQL',
    align: 'center',
    dataIndex: 'cgrSql',
    width: 360,
  },
  {
    title: '数据源',
    align: 'center',
    dataIndex: 'dbSource',
    width: 120,
  },
  {
    title: '创建时间',
    align: 'center',
    dataIndex: 'createTime',
    width: 120,
  },
];
export const searchFormSchema = [
  {
    label: '报表名称',
    field: 'name',
    component: 'JInput',
  },
  {
    label: '报表编码',
    field: 'code',
    component: 'JInput',
  },
];

const codePattern = /^[a-z|A-Z][a-z|A-Z|0-9|_|-]{0,}$/;

const mapFormSchema = bindMapFormSchema(
  {
    col_span_one: {
      colProps: {
        xs: 24,
        sm: 8,
      },
      itemProps: {
        labelCol: { xs: 24, sm: 6 },
        wrapperCol: { xs: 24, sm: 18 },
        colon: true,
      },
      style: { width: '100%' },
    },
    col_span_two: {
      colProps: {
        xs: 24,
        sm: 16,
      },
      itemProps: {
        labelCol: { xs: 24, sm: 3 },
        wrapperCol: { xs: 24, sm: 21 },
        colon: true,
      },
      style: { width: '100%' },
    },
    col_span_three: {
      colProps: {
        xs: 24,
        sm: 24,
      },
      itemProps: {
        labelCol: { xs: 24, sm: 2 },
        wrapperCol: { xs: 24, sm: 22 },
        colon: true,
      },
      style: { width: '100%' },
    },
    col_span_three_label_empty: {
      label: ' ',
      colProps: {
        xs: 24,
        sm: 24,
      },
      itemProps: {
        labelCol: { xs: 24, sm: 2 },
        wrapperCol: { xs: 24, sm: 22 },
        colon: false,
      },
      style: { width: '100%' },
    },
  },
  'col_span_one'
);

export const formSchema: FormSchema[] = [
  {
    label: '',
    field: 'id',
    component: 'Input',
    show: false,
  },
  mapFormSchema(
    {
      label: '报表编码',
      field: 'code',
      component: 'Input',
      colProps: {
        sm: 24,
        xs: 24,
        md: 12,
        lg: 8,
        xl: 8,
        xxl: 8,
      },
      dynamicRules: ({ values, model }) => {
        console.log('values:', values);
        return [
          {
            required: true,
            validator: (_, value) => {
              return new Promise((resolve, reject) => {
                if (!value) {
                  return reject('请输入报表编码！');
                }
                if (!codePattern.test(value)) {
                  return reject('编码必须以字母开头，可包含数字、下划线、横杠！');
                }
                resolve();
                // let params = {
                //   tableName: 'onl_cgreport_head',
                //   fieldName: 'code',
                //   fieldVal: value,
                //   dataId: model.id,
                // };
                // duplicateCheck(params)
                //   .then((res) => {
                //     res.success ? resolve() : reject('报表编码已存在!');
                //   })
                //   .catch((err) => {
                //     reject(err.message || '校验失败');
                //   });
              });
            },
          },
        ];
      },
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '报表名字',
      field: 'name',
      component: 'Input',
      colProps: {
        sm: 24,
        xs: 24,
        md: 12,
        lg: 8,
        xl: 8,
        xxl: 8,
      },
      dynamicRules: () => {
        return [{ required: true, message: '请输入报表名字!' }];
      },
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '动态数据源',
      field: 'dbSource',
      colProps: {
        sm: 24,
        xs: 24,
        md: 12,
        lg: 8,
        xl: 8,
        xxl: 8,
      },
      component: 'ApiSelect',
      componentProps: {
        api: getDataSourceList,
      },
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '报表SQL',
      field: 'cgrSql',
      component: 'JCodeEditor',
      rules: [{ required: true, message: '请填写报表SQL' }],
      itemProps: {
        labelCol: { xs: 24, sm: 2 },
        wrapperCol: { xs: 24, sm: 22 },
      },
      componentProps: {
        height: '200px',
        fullScreen: true,
      },
      colProps: {
        span: 20,
      },
    },
    'col_span_three'
  ),
  mapFormSchema(
    {
      label: ' ',
      field: 'analyseButton',
      component: 'Input',
      slot: 'analyseButton',
      style: 'flex: 1 1 0%; width: 100%;',
      // colProps: {
      //   span: 4,
      // },
      // itemProps: {
      //   labelCol: { xs: 1, sm: 1 },
      //   wrapperCol: { xs: 23, sm: 23 },
      //   colon: false,
      // },
    },
    'col_span_three_label_empty'
  ),
];

export const onlCgreportParamColumns: JVxeColumn[] = [
  {
    title: '参数字段',
    key: 'paramName',
    type: JVxeTypes.input,
    width: '200px',
    placeholder: '请输入${title}',
    defaultValue: '',
    validateRules: [{ required: true, message: '${title}不能为空' }],
  },
  {
    title: '参数文本',
    key: 'paramTxt',
    type: JVxeTypes.input,
    width: '200px',
    placeholder: '请输入${title}',
    defaultValue: '',
    validateRules: [{ required: true, message: '${title}不能为空' }],
  },
  {
    title: '参数默认值',
    key: 'paramValue',
    type: JVxeTypes.input,
    width: '200px',
    placeholder: '请输入${title}',
    defaultValue: '',
  },
];

export const onlCgreportItemColumns: JVxeColumn[] = [
  {
    title: '字段名字',
    key: 'fieldName',
    type: JVxeTypes.input,
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
    validateRules: [{ required: true, message: '${title}不能为空' }],
  },
  {
    title: '字段文本',
    key: 'fieldTxt',
    type: JVxeTypes.input,
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
    validateRules: [{ required: true, message: '${title}不能为空' }],
  },
  {
    title: '字段类型',
    key: 'fieldType',
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
    validateRules: [{ required: true, message: '${title}不能为空' }],
    type: JVxeTypes.select,
    options: [
      { title: '数值类型', value: 'Integer' },
      { title: '字符类型', value: 'String' },
      { title: '日期类型', value: 'Date' },
      { title: '时间类型', value: 'Datetime' },
      { title: '长整型', value: 'Long' },
    ],
  },
  {
    title: '是否显示',
    key: 'isShow',
    minWidth: '80px',
    align: 'center',
    type: JVxeTypes.checkbox,
    customValue: [1, 0],
    defaultChecked: true,
  },
  {
    title: '字段href',
    key: 'fieldHref',
    type: JVxeTypes.input,
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
  },
  {
    title: '查询模式',
    key: 'searchMode',
    type: JVxeTypes.select,
    minWidth: '150px',
    placeholder: '请选择${title}',
    options: [
      { title: '单条件查询', value: 'single' },
      { title: '范围查询', value: 'group' },
    ],
  },
  {
    title: '取值表达式',
    key: 'replaceVal',
    type: JVxeTypes.input,
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
  },
  {
    title: '字典code',
    key: 'dictCode',
    type: JVxeTypes.input,
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
  },
  {
    title: '分组标题',
    key: 'groupTitle',
    type: JVxeTypes.input,
    minWidth: '150px',
    placeholder: '请输入${title}',
    defaultValue: '',
  },
  {
    title: '是否查询',
    key: 'isSearch',
    type: JVxeTypes.checkbox,
    customValue: ['1', '0'],
    minWidth: '80px',
    align: 'center',
    defaultChecked: false,
  },
  {
    title: '是否合计',
    align: 'center',
    key: 'isTotal',
    type: JVxeTypes.checkbox,
    customValue: ['1', '0'],
    minWidth: '80px',
    defaultChecked: false,
  },
];
